<%--
  Created by IntelliJ IDEA.
  User: reid
  Date: 2017/2/27
  Time: 16:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" pageEncoding="UTF-8"
         contentType="text/html;charset=UTF-8" %>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request
            .getServerPort() + path + "/";
    request.setAttribute("basePath", basePath);
%>
<%@ include file="/resources/js/easyui/taglibs.jsp" %>
<!doctype html>
<html>
<head>
    <title>投/购币</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no"/>
    <script type="text/javascript" src="${basePath}resources/js/wechat/js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="${basePath}resources/js/v2/alertpoint.js"></script>
    <link type="text/css" rel="stylesheet" href="${basePath}resources/css/v2/member/common.css">

    <style>
        .home_paypop {
            width: 100%;
            height: 100%;
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 9999;
            background: rgba(0, 0, 0, 0.5);
            display: none;
        }

        .home_paypop_inner {
            position: absolute;
            padding: 1rem 1.5rem;
            left: 15%;
            top: 50%;
            margin-top: -5rem;
            width: 70%;
            height: 10rem;
            z-index: 2;
            background: #fff;
            border-radius: 0.3rem;
        }

        .home_paypop_inner p {
            height: 2rem;
            line-height: 2rem;
            text-align: center;
        }
    </style>
</head>
<body>
<div class="loading"></div>
<%--<header>--%>
<%--<a class="header_close" href="javascript:;"></a><span>投/购币</span>--%>
<%--</header>--%>
<div class="page">
    <div class="index_dv1">
        <div class="index_dv1_dv">
            <span class="index_dv1_title"></span>
            <dl class="index_dv1_dl">
                <dt>积分：</dt>
                <dd>${sysMember.point}</dd>
                <dt>得分：</dt>
                <dd>${sysMember.score}</dd>
                <br>
                <dt>彩票：</dt>
                <dd>${sysMember.ticket}</dd>
            </dl>
        </div>
        <p style="line-height:5rem;height:5rem;padding:0 1rem;box-sizing:border-box;clear:both;">
            <span>余币：<span class="index_dv1_span" style="font-size:2.2rem;">${sysMember.coin}</span>币</span>
            <a class="index_dv1_buybtn" href="javascript:;"></a>
        </p>
    </div>

    <div class="index_dv2">
        <p class="index_dv2_p">${place}&nbsp;${device.devicename}&nbsp;${device.deviceshortcode}&nbsp;兑币机</p>

        <div class="index_dv2_coin">
            <p style="height:2.5rem;line-height:2.5rem;">
                <a class="index_dv2_left" href="javascript:;"></a>
                <span class="index_dv2_numb"
                      style="font-size:2.2rem;">${sysMember.coin > 10 ? 10 : sysMember.coin}</span>
                <a class="index_dv2_right" href="javascript:;"></a>
            </p>

            <p>币</p>
            <a class="index_dv2_btn" href="javascript:;"></a>
        </div>
        <!--购币套餐-->
        <div class="index_dv2_combo">
            <p class="index_dv2_combop">
                <span>请选择购币金额：</span>
                <span>* ( 1 元 / 币 )</span>
            </p>
            <ul class="index_dv2_comboul">
                <c:forEach var="item" items="${discounts}" varStatus="index">
                    <li>
                        <a href="javascript:;">
                            <input type="hidden" value="${item.discountid}">
                            <span class="index_dv2_cbspan1">${item.money}</span>
                            <span class="index_dv2_cbspan2">${item.coin}币</span>
                        </a>

                        <p class="index_dv2_cbspan3">${item.coin-item.money}币</p>
                    </li>
                </c:forEach>
            </ul>
            <div style="clear:both"></div>
        </div>
        <!--购币套餐 end -->
    </div>

    <div class="index_dv3">${sysNotice.buttomcontent}</div>
    <%--<div class="tc_zhifuuser">${sysNotice.buttomcontent}</div>--%>
</div>

<div class="footer">
    <a href="javascript:;" class="idx_buy_give">投/购币</a>
    <a href="javascript:showRecord();" class="cur">消费记录</a>
</div>

<div class="home_paypop">
    <div class="home_paypop_inner">
        <p style='font-weight:bold;'>提&nbsp;&nbsp;示</p>
        <p style='margin-top:1rem;'>支付宝启动中，请稍候</p>
    </div>
</div>

</body>
</html>
<script type="text/javascript">
    $(window).on('resize', function () {
        var xf_winwidth = $(window).width();
        var xf_winheight = $(window).height();
        $("html").css("fontSize", xf_winwidth / 160 * 7 + "px");
    });
    window.onload = function () {
        $(".loading").hide();
    };

    $(document).ready(function () {
        var xf_winwidth = $(window).width();
        var xf_winheight = $(window).height();
        $("html").css("fontSize", xf_winwidth / 160 * 7 + "px");
        document.body.addEventListener('touchstart', function () {
        }); //css active ios

        //初始显示投币div or 套餐div
        var index_dv1_span = parseInt($(".index_dv1_span").text());
        if (index_dv1_span > 0) {
            $(".index_dv2_coin").stop().show();
            $(".index_dv2_combo").stop().hide();
        } else {
            $(".index_dv2_coin").stop().hide();
            $(".index_dv2_combo").stop().show();
        }

        //套餐ul下，小图标是否显示
        var index_dv2_cbspan3 = new Array();
        $(".index_dv2_comboul li .index_dv2_cbspan3").stop().hide();
        $(".index_dv2_comboul li").each(function (index) {
            index_dv2_cbspan3[index] = parseInt($(".index_dv2_comboul li:eq(" + index + ") .index_dv2_cbspan3").text());
            if (index_dv2_cbspan3[index] > 0) {
                $(".index_dv2_comboul li:eq(" + index + ") .index_dv2_cbspan3").stop().show();
            }
        });

        //购买电子币
        $(".index_dv1_buybtn").on("click", function () {
            $(".index_dv2_coin").stop().slideUp(500);
            $(".index_dv2_combo").stop().show();
        });

        //购买电子币 套餐点击购买
        $(".index_dv2_comboul a").on("click", function () {
            var index_dv1_span = parseInt($(".index_dv1_span").text());
            var index = $(this).closest("li").index();
            var index_dv2_cbspan1 = parseInt($(this).find(".index_dv2_cbspan1").text());
            var index_dv2_cbspan2 = parseInt($(this).find(".index_dv2_cbspan2").text());

            var discountId = $(this).closest("li").find("input").val();

            prepay(discountId);

            $(this).addClass("cur");

            $(".index_dv2_comboul a:eq(" + index + ")").removeClass("cur");
            $(".index_dv1_span").text(index_dv1_span + index_dv2_cbspan2);
            $(".index_dv2_coin").stop().show();
            $(".index_dv2_combo").stop().hide();
        });

        $(".idx_buy_give").on("click", function () {
            var index_dv1_span = parseInt($(".index_dv1_span").text());
            if (index_dv1_span > 0) {
                $(".index_dv2_coin").stop().show();
                $(".index_dv2_combo").stop().hide();
            }
        })

        //投币按钮
        $(".index_dv2_btn").on("click", function () {
            var index_dv2_numb = parseInt($(".index_dv2_numb").text());
            var index_dv1_span = parseInt($(".index_dv1_span").text());

            if (index_dv2_numb < 0 || index_dv2_numb > index_dv1_span) {
                alert("投币数不能为零或大于余币数");
                return;
            }

            giveCoin(index_dv2_numb);

            $(".index_dv1_span").text(index_dv1_span - index_dv2_numb);
        });

        //投币  减号
        $(".index_dv2_left").on("click", function () {
            var index_dv2_numb = parseInt($(".index_dv2_numb").text());
            var index_dv1_span = parseInt($(".index_dv1_span").text());
            if (index_dv2_numb > 0) {
                index_dv2_numb--;
                $(".index_dv2_numb").text(index_dv2_numb);
            } else {
                index_dv2_numb = 0;
                $(".index_dv2_numb").text(index_dv2_numb);
            }

        });

        //投币  加号
        $(".index_dv2_right").on("click", function () {
            var index_dv2_numb = parseInt($(".index_dv2_numb").text());
            var index_dv1_span = parseInt($(".index_dv1_span").text());
            if (index_dv2_numb < index_dv1_span) {
                index_dv2_numb++;
                $(".index_dv2_numb").text(index_dv2_numb);
            } else {
                index_dv2_numb = index_dv1_span;
                $(".index_dv2_numb").text(index_dv2_numb);
            }
        });

    });
    $(window).on('resize', function () {
        var xf_winwidth = $(window).width();
        var xf_winheight = $(window).height();
        $("html").css("fontSize", xf_winwidth / 160 * 7 + "px");
    });
    window.onload = function () {
        $(".loading").hide();
    };


    /**-------------------------------- 微信支付 ----------------------------------**/
    function prepay(discountid) {
        $(".home_paypop").show();

        var url = "${basePath}/pay/member/prepay";
        $.ajax({
            url: url,
            type: "POST",
            data: {
                deviceid: '${device.deviceid}',
                openid: '${openid}',
                discountid: discountid
            },
            dataType: "json",
            cache: false,
            error: function (response) {
                $(".home_paypop").hide();
                if (response.status == 404) {
                    alert("404!服务器提交链接未找到!");
                } else if (response.status == 500) {
                    alert("服务器异常,请稍后重试!");
                } else if (response.status == 504 || response.status == "timeout") {
                    alert("网络异常,请稍后重试!");
                } else {
                    alert(response.status + "错误!");
                }
            },
            success: function (message) {
                if (message.message.type == "success") {
                    window.location.href = message.message.content;
                } else {
                    alert(message.message.content);
                    return;
                }
                $(".home_paypop").hide();
            }
        });
    }

    function giveCoin(coin) {
        var url = "${basePath}pay/member/give";

        $.ajax({
            url: url,
            type: "POST",
            data: {
                deviceId: ${device.deviceid},
                memberId: ${sysMember.memberid},
                coin: coin
            },
            dataType: "json",
            cache: false,
            error: function (response) {
//                $(".home_paypop").hide();
                if (response.status == 404) {
                    alert("404!服务器提交链接未找到!");
                } else if (response.status == 500) {
                    alert("服务器异常,请稍后重试!");
                } else if (response.status == 504 || response.status == "timeout") {
                    alert("网络异常,请稍后重试!");
                } else {
                    alert(response.status + "错误!");
                }
            },
            success: function (message) {
                alert(message);
                if (message == "success") {
                    alert("投币成功", "cur");
                } else {
                    alert("投币失败");
                    return;
                }
                $(".home_paypop").hide();
            }
        });
    }

    function showRecord() {
        var memberId = ${sysMember.memberid};
        var url = '${basePath}web/pUBConsumption/listView?memberid=' + memberId + '&page=1&rows=6';
        window.location.href = url;
    }
</script>
